import { _decorator, Component, instantiate, JsonAsset, Node, Prefab, tween, Vec3 } from 'cc';
import { PrefabCfg } from '../../../auto/PrefabCfg';
import { Match3ZiUE } from './Match3ZiUE';
import { ResLoader } from '../../../core/modules/res/ResLoader';
import { SpriteFramesCfg } from '../../../auto/SpriteFramesCfg';
import { JsonsCfg } from '../../../auto/JsonsCfg';
import { ZiStack } from './ZiStack';
const { ccclass, property } = _decorator;

@ccclass('Match3UI')
export class Match3UI extends Component {

    @property(Node) 
    private collectArea: Node = null;

    static R(loader: ResLoader) {
        loader.addUI(Match3ZiUE)

        for (let i = 1; i <= 30; i++) {
            loader.addSpriteFrame(SpriteFramesCfg.pai(`pai-${i}`));
        }

    }

    @property(Node)
    private board: Node = null;
    private m_ZiList: Match3ZiUE[] = []
    private stacks: ZiStack[][] = []

    addZi(ziUE: Match3ZiUE) {
        //加到数组
        this.m_ZiList.push(ziUE);

        for (let r = 0; r < 6; ++r) {
            for (let c = 0; c < 6; ++c) {
                this.stacks[ziUE.row + r][ziUE.col + c].push(ziUE)
            }
        }
    }

    calcClickable(ziUE: Match3ZiUE): boolean {
        let stack: ZiStack = null;
        for (let r = 0; r < 6; ++r) {
            for (let c = 0; c < 6; ++c) {
                stack = this.stacks[ziUE.row + r][ziUE.col + c];
                if (!stack.empty && stack.top !== ziUE) {
                    // 有一个棋子栈顶部不是该棋子，说明被遮挡，不可点击
                    return false;
                }
            }
        }

        return true;
    }

    async start() {

        console.log('Main Page Type')
        const COL = 7;
        const ROW = 10;
        const SPLIT = 6;
        for (let r = 0, rmax = ROW * SPLIT; r < rmax; ++r) {
            let row_stacks: ZiStack[] = [];
            this.stacks.push(row_stacks);
            for (let c = 0, cmax = COL * SPLIT; c < cmax; ++c) {
                row_stacks.push(new ZiStack())
            }
        }

        let jsonAsset = await gtr.res.loadAssetAsync(JsonsCfg.level(0), JsonAsset);
        const levelJson = jsonAsset.json as {
            zis: [col: number, row: number, style: number][]
        }

        let clickFunc = (clickZi: Match3ZiUE) => {
            let isClickable = this.calcClickable(clickZi);
            if (!isClickable) return;
            let ziCol = clickZi.col;
            let ziRow = clickZi.row;
            this.removeZi(clickZi);
            // 目前表现是移动到 collectArea 节点下
            clickZi.node.setParent(this.collectArea, true);
            tween(clickZi.node)
                .to(0.15, { position: new Vec3(0, 0, 0) })
                .start()
        
            // 下方刷新
            let stack: ZiStack = null;
            for (let r = 0; r < 6; ++r) {
                for (let c = 0; c < 6; ++c) {
                    stack = this.stacks[ziRow + r][ziCol + c];
                    if (!stack.empty) {
                        stack.top.setClickable(this.calcClickable(stack.top));
                    }
                }
            }
        }


        levelJson.zis.forEach(zi => {

            let ziUE = gtr.ui.instantiate(Match3ZiUE)

            ziUE.node.setParent(this.board);
            ziUE.init(zi[0], zi[1], zi[2],clickFunc);
            this.addZi(ziUE);
            // ziUE.node.setPosition(zi[0] * 17, zi[1] * 20)
            // ziUE.setDisplay(zi[2])
        });
        //刷新一次所有的显示
        this.m_ZiList.forEach(ziUE => {
            ziUE.setClickable(this.calcClickable(ziUE))
        })

        // this.m_ResLoader = new ResLoader().autoRelease(this);
        // this.m_ResLoader.addUI(Match3ZiUE);
        // await this.m_ResLoader.load();

        // this.m_Match3ZiUE_Prefab = await gtr.res.loadAssetAsync(PrefabCfg.Match3ZiUE,Prefab);
        // this.m_Match3ZiUE_Prefab.addRef()


    }

    removeZi(ziUE: Match3ZiUE) {
        this.m_ZiList.splice(this.m_ZiList.indexOf(ziUE), 1);
        for (let r = 0; r < 6; ++r) {
            for (let c = 0; c < 6; ++c) {
                this.stacks[ziUE.row + r][ziUE.col + c].pop();
            }
        }

    }



}


